$scrollbarBgColor = rgba(0, 0, 0, 0.26);
$scrollbarBgColorHover = rgba(0, 0, 0, 0.42);

.tulp-scrollbar
  overflow hidden
  position relative
  height 100%
  &:active > &__bar,
  &:focus > &__bar,
  &:hover > &__bar
    opacity 1
    transition opacity 340ms ease-out

.tulp-scrollbar
  &__wrap
    overflow scroll
    height 100%
    scrollbar-width none
    &::-webkit-scrollbar
        display none
  &__bar
    position absolute
    right 2px
    bottom 2px
    z-index 1
    border-radius 4px
    opacity 0
    transition opacity 120ms ease-out
    &.is-horizontal
      height 6px
      left 2px
      & > div 
        height 100%
    &.is-vertical
      width: 6px
      top: 2px
      & > div 
        width 100%
  &__thumb 
    position relative
    display block
    width 0
    height 0
    cursor pointer
    border-radius inherit
    background-color $scrollbarBgColor
    transition 0.3s background-color
    &:hover, &.active
      background-color $scrollbarBgColorHover